<template>
	<view class="y-page-common page">
		<view class="tip">
			请确保是<text class="name" v-if="name.length">*{{ name.slice(name.length - 1) }}</text>本人操作
		</view>
		<view class="image-content" @click="handleClick">
			<image style="width: 100%; height: 100%; background-color: #eeeeee;" mode="scaleToFill"
				:src="src"></image>
		</view>
		<view class="icons-section">
			<view class="icons-item">
				<uni-icons custom-prefix="custom-icon" type="spinner-cycle" size="30"></uni-icons>
				<view class="icon-text">
					光线充足
				</view>
			</view>
			<view class="icons-item">
				<uni-icons custom-prefix="custom-icon" type="auth" size="30"></uni-icons>
				<view class="icon-text">
					正对手机
				</view>
			</view>
			<view class="icons-item">
				<uni-icons custom-prefix="custom-icon" type="close" size="30"></uni-icons>
				<view class="icon-text">
					脸无遮挡
				</view>
			</view>
		</view>
		<ReadmeBtn fixed :readme="['个人贷款电子签名协议', '个人信息处理授权书(含人行征信授权)']" text="发起申请" @submit="submit"></ReadmeBtn>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: '',
				src: '../../static/imgs_personal/scaning.jpg'
			}
		},
		onLoad() {
			const {
				name
			} = uni.getStorageSync('userInfo')
			this.name = name || ''
		},
		methods: {
			handleClick() {
				this.src = '../../static/imgs_personal/scansuccess.jpg'
			},
			async submit() {
				// 返回额度申请页面
				await this.$myloading() // async
				uni.setStorageSync('isIDAuth', true);
				uni.redirectTo({
					url: '/pages/index/success?go=1'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		width: 100%;
		height: 100%;
		padding: 26rpx;
		display: flex;
		flex-direction: column;
		align-items: center;

		.tip {
			font-size: 30rpx;

			.name {
				color: #006AE9;
			}
		}
		
		.image-content {
			width: 40vw;
			height: 40vw;
			margin: 80rpx auto 200rpx;
			border-radius: 50%;
			border: 4rpx solid #006AE9;
			overflow: hidden;

		}
		.icons-section {
			
			width: 60%;
			display: flex;
			justify-content: space-between;
			.icons-item {
				display: flex;
				flex-direction: column;
			}
		}
	}
</style>